2020 原创精选! shader | 挖洞 | 流体 | 3D | 绳子纹理 | 四叉树 | 数学 样样都有！

总能找到对你有帮助的~

前言

白玉无冰写文已经一年多了，从原来的翻译文到后来的研究笔记文，一路走来，有些不错的文章整理推荐给大家。

注意！大部分文章是研究笔记，出于兴趣爱好，学习记录的一些想法。并未在实际项目中使用过（当然有些被粉丝使用到项目中），需要大家认真考量哈。

但是总能找到一些对大家游戏开发有帮助的地方，希望能给大家带来新思路，新想法。

点击对应标题可以直达文章哦~

整理

主要分为以下几大类：

• shader
• 物理挖洞
• 物理流体
• 物理粒子
• 绳子纹理
• Cocos 3D
• 抛物线
• 多边形裁剪与gizmo
• 其他

shader

玩转入门 shader ， 一些效果展示。

这篇文章整理了一些入门 Cocos Creator shader 的参考资料，引入了一个攻击闪白效果。

介绍了用 sin 函数模拟水滴落水的效果。

把一张图分割多个顶点，使用 mesh 并计算相应的纹理坐标，最终实现一个顶点动画效果。

使用卷积滤镜实现 模糊、锐化、浮雕 等各种效果。

把两种图片混色，实现渐变效果。

感受数学公式带来的 shader 。

单纯的用 shader 写一个动画！视频讲解！

巧用渲染模式平铺(TILED)和 sin 实现顶点动画。

uniform 方案和 assembler 方案的实现。需要注意的是 drawcall 数量并不是越少越好，最佳性能往往是 CPU 与 GPU 负载均衡的结果。

溶解！shader 入门实战之噪声纹理！

沿着法线向量膨胀！

物理挖洞

讲述了物理挖洞的实现过程，从原来的链条到后来的多边形，再到3D视觉效果，最后到分块，层层递进，建议按顺序阅读，含一些视频讲解。

物理流体

实现水连结效果。

用 shader + camera 实现流体效果 ！视频讲解！

物理粒子

让 cocos Q弹起来！物理流体之 LiquidFun 流体纹理 shader !

绳子纹理

讲述了应用 Sprite 渲染模式 Mesh 和 cc.Graphics ，实现画线纹理的操作。不过还是推荐使用 cc.meshRenderer 去实现哈。

Cocos 3D

坐标转换！旋转！跳跃！不停歇！

瞄哪打哪！超简单的射线检测！

随便讲讲雾的原理以及旧版本的使用雾的方法。

抛物线

抛物线运动可以看成是多个方向的匀加速直线运动。

已知初速度大小，起点终点位置，如何按预期轨迹行动呢？

给平抛高抛发射添加一个瞄准线！

3D 中抛物线的计算

多边形裁剪与gizmo

一种替换 cc.mask 的方案，减少 draw call。还介绍了配合插件gizmo的使用。

介绍了 mesh 相关的参数与使用，多边形分割算法等。

对 mesh 实现多边形裁剪图片进一步操作优化，在编辑器用鼠标拖动顶点编辑多边形形状！

支持缩放旋转，支持合图，支持gizmo添加节点和调整位置，支持顺时针逆时针。

其他

支持定义任意多个属性值，简单好用！

摇杆与蛇移动的结合！

大量物体以随机初速度的飞溅运动！正态分布的飞溅运动！

介绍了 JS 中的类型转换和比较。

支持 Sprite 和 Label！参数可调！

战斗地面效果！在 2D 中实现有纵深感(透视)的卷动效果。当然也可以直接用3D节点。这里提供一个思路供大家参考参考。

四叉树与引擎内置碰撞检测的结合运用。

代码

项目工程可以在github上找到

• https://github.com/baiyuwubing
• https://gitee.com/lamyoung  (同步github，国内这个可能快一点)

B站视频:

• https://space.bilibili.com/1756070/video

qq加油群 (群文件有一些📚书籍资料)

• 859642112

微信视频号：

后语

感谢大家一直以来的陪伴(分享/点赞/在看/留言/赞赏)，白玉无冰才能一路输出，希望能帮助大家一起成长学习！

点击“阅读原文”查看精选导航

“点赞“ ”在看” 鼓励一下▼